<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!--HTML中也有 类 的概念，在标签中可以指定一个类的值-->

    <!--类选择器的语法为：  .类名{键值对}              -->

    <!--每个标签都可以设置类属性，相同的类是一组-->

    <!--一个元素不能有多个class属性，即以下写法是不对的： <p class="p1" class="p2"> -->

    <!--如果类的属性由多个单词构成，用 - 来进行拼接-->

    <!--一个class属性,可以有多个值，用空格隔开   <h1 class="p1 p2 p3"   -->
    
    <!--用类选择器，作用对象是一类的成员，而不是具体的某个标签。-->
    <style>
        .part1{
            color:red;
            font-size:30px;
        }
        .part2{
            color:blue;
            font-size:30px;
        }
    </style>
</head>
<body>
    <h1>崩坏三，为世界的所有美好而战</h1>
    <h2 class="part1">第一章</h2>
    <h3 class="part1">初始角色:琪亚娜，芽衣，布洛妮娅</h3>
    <h2 class="part2">第二章</h2>
    <h3 class="part2">初始角色:希娜狄雅</h3>
</body>
</html>